<!--
Project: Picture Download Toolbar
Author: Lasantha Bandara
Index No: 070045e
Dipartment: Computer Science and Engineering, University of Moratuwa

File Name: my_toolstrip.HTML
Purpose: this code enters buttons and a text box into the status bar of the browser. it acts as the user interface of
		this add-on.
-->
<html>
<head>
<title>PDTB</title>

<script>

function image(){
	var word=document.getElementById('imagebox').value;
	window.open('http://images.google.lk/images?hl=en&q='+word+'&sa=N&start=0&ndsp=21&ei=mvMcS-HsGcaFnAe3z7DfAw&gbv=2');
}

function next(){
	chrome.tabs.getSelected(null,function(tab){
		var tempArray1=tab.url.split("start=");
		var tempArray2=tempArray1[1].split("&");
		var now=parseInt(tempArray2[0]);
		
		var next=now+21;
		
		var tArray1=tab.url.split("q=");
		var tArray2=tArray1[1].split("&");
		var word=tArray2[0];
		
		var urlnew="http://images.google.lk/images?gbv=2&hl=en&sa=1&q="+word+"&btnG=Search&meta=&aq=f&oq=&start="+next;
		chrome.tabs.update(tab.id,{url:urlnew});	
		
	}
	);
}

function previous(){
	chrome.tabs.getSelected(null,function(tab){
		var tempArray1=tab.url.split("start=");
		var tempArray2=tempArray1[1].split("&");
		var now=parseInt(tempArray2[0]);
		
		if(now!=0){
			var pre=now-21;
			
			var tArray1=tab.url.split("q=");
			var tArray2=tArray1[1].split("&");
			var word=tArray2[0];
			
			var urlnew="http://images.google.lk/images?gbv=2&hl=en&sa=1&q="+word+"&btnG=Search&meta=&aq=f&oq=&start="+pre;
			chrome.tabs.update(tab.id,{url:urlnew});	
		}
		else{
			chrome.tabs.update(tab.id,{url:urlnew});
			}
	}
	);
}

function go(){
	
	chrome.tabs.getSelected(null,function(tab){
		var keli=new Array();
		keli=tab.title.split("-");
		var strtno=(parseInt(document.getElementById('tbox').value)-1)*21;
		var url2='http://images.google.lk/images?gbv=2&hl=en&q='+keli[0]+'&sa=N&start='+strtno+'&ndsp=21';
		chrome.tabs.update(tab.id,{url: url2});	
		document.getElementById('tbox').value="1";
	});
	
	
	
}

function view(){
	
	var number=document.getElementById('viewbox').value;
	if(number==""){
		number="1";
		document.getElementById('viewbox').value="1";
	}
	var tabid;
	
	chrome.tabs.getSelected(null, function(tab){	
		chrome.tabs.sendRequest(tab.id, {picNo: number}, function(response) {				
		});
		tabid=tab.id;
	});
	
	chrome.tabs.executeScript(tabid, {file: 'view.js'});		
}

function download(){
	var number=document.getElementById('dbox').value;
	if(number==""){
		number="1";
		document.getElementById('dbox').value="1";
	}
	var tabid;
	
	chrome.tabs.getSelected(null, function(tab){	
		chrome.tabs.sendRequest(tab.id, {picNo: number}, function(response) {				
		});
		tabid=tab.id;
	});
	
	chrome.tabs.executeScript(tabid, {file: 'download.js'});	
}

function dall(){
	chrome.tabs.getSelected(null,function(tab){
		chrome.tabs.executeScript(tab.id, {file: 'dall.js'});
	});
}

</script>

<style type="text/css">

body{ border: 2px outset #DDD; margin: 0; overflow: hidden; padding: 4px; font-family: tahoma, sans-serif; width: 125px; background-color:#b0c4de}

.menu div{ color: blue; font-size: 12px; padding: 4px; white-space: nowrap}
.menu div:hover{ background-color: #316AC5; color: white; cursor: default; }
.menu div span{ float: right; }

.brows1{ width:123px;   }

.brows2{  width:40px;	}
	
.btn{	width:75px;	}
	
.btn2{	background-color:grey; width:98px }
	
	  
</style>
</head>

<body>

<div class="menu" >

	<input type="textbox" id="imagebox" class="brows1" onclick="imagebox.select();" value="Google" onkeypress="if(event.keyCode=='13'){image()}">
	
	<table>
	<tr>
	<td><img src="gimage.PNG"></td>
	<td><input type="button" value="Images" onclick="image()" class="btn2"></td>
	</tr>
	</table>

	<div onclick="previous()">
	  Previous
	</div>

	<div onclick="next()">
	  Next
	</div>
	
	<table>
	<tr>
	<td><input type="textbox" value="1" id="tbox" class="brows2" onclick="tbox.select();" onkeypress="if(event.keyCode=='13'){go()}"></td>
	<td><input type="button" id="gobutton" class="btn" onclick="go()" value="Go" style="background-color:grey"></td>
	</tr>
	</table>
	
	<table>
	<tr>
	<td><input type="textbox" value="1" id="viewbox" class="brows2" onclick="viewbox.select();" onkeypress="if(event.keyCode=='13'){view()}"></td>
	<td><input type="button" id="viewbutton" class="btn" onclick="view()" value="View" style="background-color:grey"></td>
	</tr>
	</table>
	
	<table>
	<tr>
	<td><input type="textbox" value="1" id="dbox" class="brows2" onclick="dbox.select();" onkeypress="if(event.keyCode=='13'){download()}"></td>
	<td><input type="button" class="btn" onclick="download()" value="Download" style="background-color:grey"></td>
	</tr>
	</table>
	
	<div onclick="dall()" style="{text-align:center}">
	  Download all
	</div>
	
</div>

</body>
</html>